<template>
  <div>
    <!-- 搜索 -->
    <!-- 配件类型查询 -经销商-->
    <TopFilter ref="TopFilterss" :list="topFilterInit" :cols="3" :collapse="collapse" labelWidth="90" @filterChange="changeHandle"></TopFilter>
    <!-- table -->
    <FilterTable
      ref="table"
      :columns="columns"
      :params="fetchParams"
      :fetchapi="fetchapi"
      :datakey="'records'"
      :onColumnsChange="columns => (this.columns = columns)"
      :is-select-column="false"
    >
      <template slot="controls" slot-scope="props">
        <multiuse-button size="small" type="primary"  :click="exportFileBtn.bind()">导出</multiuse-button>
      </template>
    </FilterTable>
  </div>
</template>
<script>
import { getListByPage, getListForExport,getPartType,exporturl } from '@/api/claim/dealer/PartTypeQuery';
import { dictionary } from '@/utils/dictMixin';
import { exportExcelFile } from '@/utils/index';
import { getPart } from '@/api/dictionary/index';
export default {
  mixins: [dictionary],
  data() {
    return {
      dataList: [],
      visible: false,
      visibleDrawer: false,
      collapse: false,
      infoId: null,
      fetchapi: getListByPage,
      topFilterInit: this.topFilterInitFun(),
      flterValue: {}, //参数
      columns: this.creatHeader(),
      fetchParams: {}, //ipa 接口
      selectedRows: [], //选中经销商
      dialogTitle: '选择车辆',
      visibleAdd: false
    };
  },
  created() {this.chuqi();},
  methods: {
    // 导出
  async  exportFileBtn() {
      let json = Object.assign({}, { CODE: 'CODE_00000181' }, this.fetchParams);
      let res = await exporturl(json);
      if (res.resultCode == 200) {
        this.$router.push('/admin/auth/oem/downloadCenter');
      }
    },
    async chuqi() {
      const res = await getPart();
      if (res.resultCode == 200) {
        this.topFilterInit.find(x => x.fieldName == 'typeId').initialValue = '';
        this.topFilterInit.find(x => x.fieldName == 'typeId').itemList = res.data.map(y => ({ text: y.name, value: y.code }));
      }
    },
    //搜索获取数据
    changeHandle(val) {
      this.fetchParams = Object.assign({}, this.fetchParams, val);
    },
    //搜索数据
    topFilterInitFun() {
      return [
        {type: 'INPUT', label: '配件名称', fieldName: 'partName', placeholder: '请输入配件名称...', initialValue: ''},
        {type: 'INPUT', label: '配件代码', fieldName: 'partCode', placeholder: '请输入配件代码...', initialValue: ''},
        {type: 'SELECT', label: '配件类型', fieldName: 'typeId', placeholder: '请选择配件类型...', itemList: [], filterable: true}
      ];
    },
    //table表头和数据源
    creatHeader() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {title: '配件名称', dataIndex: 'partName', sorter: true},
        {title: '配件代码', dataIndex: 'partCode', sorter: true},
        {title: '配件类型', dataIndex: 'typeName', sorter: true},
        { title: '营运类型', dataIndex: 'operationType', sorter: true , render: params => {
            return <span>{this.createDictText(params.row.operationType, '5584')}</span>;
          }},
        { title: '销售年份', dataIndex: 'salesYear', sorter: true },
        {title: '创建人', dataIndex: 'createdBy', sorter: true},
        {title: '创建时间', dataIndex: 'createdAt', sorter: true},
        {title: '修改人', dataIndex: 'updatedBy', sorter: true},
        {title: '修改时间', dataIndex: 'updatedAt', sorter: true}
      ];
    }
  }

};
</script>

<style lang="less" scoped></style>
